<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>symbol,graphic</title>
<link rel="stylesheet" type="text/css"
	href="http://localhost:8080/testA/arcgisjs/js/dojo/dijit/themes/tundra/tundra.css" />
<script type="text/javascript"
	src="http://localhost:8080/testA/arcgisjs/init.js"></script>
<link rel="stylesheet" type="text/css"
	href="http://localhost:8080/testA/arcgisjs/js/esri/css/esri.css" />
</head>
<script type="text/javascript">
	require(
			[ 'esri/map', 'esri/geometry/Extent', 'test/MeasureLength',
					'esri/layers/ArcGISTiledMapServiceLayer', "dojo/parser",
					'esri/geometry/Point', "esri/layers/GraphicsLayer",
					"esri/layers/ArcGISDynamicMapServiceLayer", "dojo/on","esri/graphic","esri/symbols/Symbol",
					"esri/symbols/SimpleMarkerSymbol","esri/symbols/SimpleLineSymbol","esri/symbols/SimpleFillSymbol", "esri/Color","esri/geometry/Circle",
					"dojo/domReady!" ],
			function(map1, Extent, MeasureLength, ArcGISTiledMapServiceLayer,
					parser, Point, GraphicsLayer, ArcGISDynamicMapServiceLayer,on,Graphic,SimpleMarkerSymbol,SimpleLineSymbol,SimpleFillSymbol,Color,Circle
					) {
				parser.parse();
				var url = "http://cache1.arcgisonline.cn/arcgis/rest/services/ChinaOnlineCommunity/MapServer";

				var initialExtent = new esri.geometry.Extent({
					"xmin" : 6971056.979606233,
					"xmax" : 16363639.015286192,
					"ymin" : 1932328.0750486827,
					"ymax" : 7152059.8625854105,
					"spatialReference" : {
						"wkid" : 102100
					}
				});

				var myMap = new map1('arcgisDiv', {
					//center : [-98, 40] , 不能与extent同时存在
					extent : initialExtent
				});


	            
				//var wmtsLayer = new WMTSLayer("http://v2.suite.opengeo.org/geoserver/gwc/service/wmts", options);
				var myTiledMapServiceLayer = new ArcGISTiledMapServiceLayer(url);
				myMap.addLayer(myTiledMapServiceLayer);

				
	            var glayer = new GraphicsLayer({ id: "circles" });
	            
	            myMap.addLayer(glayer);
	            var pp =  new Point([45,114]);
	            var radius = myMap.extent.getWidth() / 10;
                var circle = new Circle({
                    center:pp,
                    radius: 2000
                });
                
                
				//style,
				var smbo1 =  new SimpleMarkerSymbol(
						SimpleMarkerSymbol.STYLE_SQUARE,
						10,
						new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
				           new Color([255,0,0]), 2),
				           new Color([0,255,0,0.25]));
				
                var simpleSymbol = new  SimpleMarkerSymbol( SimpleMarkerSymbol.STYLE_CIRCLE, 12, 
            			new  SimpleLineSymbol( SimpleLineSymbol.STYLE_SOLID,
            					new dojo.Color([255,0,0]), 1),
            				    new dojo.Color([255,167,36,0.45]));
               
				var smbo2 = new SimpleMarkerSymbol();
				var smbo3 = new SimpleMarkerSymbol();
				var smbo4 = new SimpleFillSymbol() ;
				var oL = smbo4.outline;
				//oL.setColor("blue");
				smbo4.setColor("blue");
				var pt1 = new Point(45,126);
				
				var g1 = new Graphic(circle,smbo4);
				var g2 = new Graphic();
				var g3 = new Graphic();
				
				 glayer.add(g1);
				 
			      dojo.connect(myMap, "onClick", function(e){
				         if(g==0){
				        	 g=1;
				        	 myTiledMapServiceLayer2.hide();
				         }else{
				        	 g=0;
				        	 myTiledMapServiceLayer2.show();
				         }
				      });
				//myTiledMapServiceLayer.addGraph(g1);
				
 

				/*
				 * 
				 var myTiledMapServiceLayer = new ArcGISTiledMapServiceLayer(url);
				 myMap.addLayer(myTiledMapServiceLayer);
				 myMap.addLayer(new GraphicsLayer({id:"other"}));
				 dojo.connect(dojo.byId('test'), "onclick", measure);
				 dojo.connect(myMap, "onClick", function(e){
				 });
				 function measure(){
				
				 myMap.centerAndZoom(new Point(116,24), myMap.getMaxZoom() - 1);
				 var t1 = new MeasureLength();
				 myMap.setMapCursor("url(cursor_linemeasure.cur),auto");
				 MeasureLength.action(myMap);
				 }
				 function zoom(){
				 myMap.centerAndZoom(new Point(45,35), map.getMaxZoom() - 1);
				 }
				
				 */
			})
</script>
<body class="tundra">
	<div id="arcgisDiv"
		style="width: 900px; height: 600px; border: 1px solid #000;"></div>
	<button id="test">测试复位</button>
</body>
</html>